

// 获取搜索按钮
var searchBtn = document.querySelector('.searchbox .search');
// 获取输入框
var inputEle = document.querySelector('.searchbox input')

// 点击搜索按钮，发起Ajax请求，传参数给服务器端，服务器端返回搜索的结果
searchBtn.onclick = () => {
    axios.get('/user/search', { params: { searchkey: inputEle.value } }).then((res) => {
        render(res.data.list);
        console.log(res.data);
    })
}
// 渲染列表
function render(data) {
    var str = '';

    str = data.map((item, index) => {
        return `<ul class="row">
        <li>${item.email}</li> 
        <li>${item.name}</li>
        <li>${item.phone}</li>
        <li>${item.ingroup}</li>
        <li>${item.isadmin ? '是' : '否'}</li>
        <li class='${item.status ? '' : 'error'}'>${item.status ? '正常' : '异常'}</li>
        <li>
            <span class="iconfont icon-bianji editicon" id="101"></span>
            <span class="iconfont icon-shanchu deleteicon" id="101"></span>
        </li>
    </ul>`
    }).join('')

    if (str == '') {
        str = '<ul style="text-align:center;color:red;">未查询到数据!</ul>'
    }

    document.querySelector('.table .table-body').innerHTML = str;


}

// axios是从axios.min.js文件中暴露的 用来发送Ajax请求的一个对象
axios.get('/user/list', { params: { page: 1, count: 10 } }).then((res) => {

    // 调用render方法，传入后端返回的数据 完成渲染
    render(res.data.list);
    console.log(res.data);
})

axios.post('/user/login', { phone: '13611129070', path: '1234' }).then((res) => {
    console.log(res.data);
})

// axios.put()

// axios.delete()
